<template>
	<view>
		<uv-popup ref="toastPopup" :closeOnClickOverlay="false" :safeAreaInsetBottom="false" round='10px' :zIndex="100000000">
			<view class="flex-column-center toastBg" style="background-color: white; padding: 12px; width: 279px;">
				<image :src="`../../static/popup-${isSuccees ? 'success' : 'warning'}.png`" style="height: 36px; width: 36px;"></image>
				<text class="font-18 font-weight-medium" style="color: #313C56;">{{ msg }}</text>
				<text v-if="!($uv.test.empty(subMsg))" class="font-14 font-weight-regular" style="color: #6B7885; margin-top: 3px;">{{ subMsg }}</text>
			</view>
		</uv-popup>
	</view>
</template>

<script>
	export default {
		name: "toast",
		emits: [''],
		data() {
			return {
				msg: '',
				subMsg: '',
				isSuccees: false,
			};
		},
		methods: {
			/**
			 * 显示弹框
			 * @param {Object} config 
			 * config.msg 提示内容
			 * config.subMsg 提示副内容
			 * config.isSuccees 默认失败(红色感叹号),  可以不传， false = 红色感叹号，  true = 绿色勾勾
			 * config.complete 弹框消失后的回调事件
			 */
			show(config) {
				this.msg = config.msg
				this.subMsg = config.subMsg
				if (typeof(config.isSuccees) == 'boolean') {
					this.isSuccees = config.isSuccees
				} else{
					this.isSuccees = false
				}
				this.$refs.toastPopup.open()
				setTimeout(() => {
					this.$refs.toastPopup.close()
					if (typeof(config.complete) == 'function') {
						config.complete()
					}
					
				}, 2000);
				
			},
		
		}
	}
</script>

<style>
	.toastBg {
		/* background-position: 10px;
		background-size: 48px 48px;
		background-repeat: no-repeat; */
		/* background-image: url('../../static/popup-success.png'); */
	}
</style>